<template>
  <div class="index_body">
    <div class="top_text_body">
      <h1>职工教育  <span><i class="iconfont icon-weizhi1"></i>{{user_Data.site_name}}</span></h1>
      <div class="qh_btn"><i class="iconfont icon-web-icon-"></i>每日一课</div>
      <p>职工教育权威服务平台</p>
    </div>
    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">


      <div class="user_mdl">
        <div class="user_main">
          <div class="img"><img src="http://gd.ttt.workeredu.com/statics/images/per_img.png" alt=""></div>
          <div class="info">
            <h3>{{user_Data.name}}<span>{{user_Data.netin_status == 1 ? '职工' : ''}}</span></h3>
            <p>{{user_Data.company}}</p><a href="javascript:;" class="gh_label">{{user_Data.union_name}}</a>
          </div>
          <a class="rz_btn yrz_btn" href="javascript:;">
            <i :class="user_Data.netin_status == 1?'iconfont icon-renzhengpeizhi' : 'iconfont icon-question'"></i>
            {{user_Data.netin_status == 1 ? '身份已确认' : '身份未确认'}}
          </a>
        </div>
      </div>

      <div class="flzj_tab">
        <div class="top_nx_text h_text_sl_1">2018年度福利总览</div>
        <div class="je_text">
          <a href="v3_ndfl_dlq.html" class="je_item">{{fl_zl_data.wtTotalPrice}}</a>
          <a href="v3_ndfl_lsjl.html" class="je_item">{{fl_zl_data.gtTotalPrice}}</a>
        </div>
        <div class="xm_text">
          <a href="v3_ndfl_dlq.html" class="je_item">
            <p>待收福利项目</p>
            <strong>{{fl_zl_data.wtTotalProject}}</strong>
          </a>
          <a href="v3_ndfl_lsjl.html" class="je_item">
            <p>已领取福利项目</p>
            <strong>{{fl_zl_data.gtTotalProject}}</strong>
          </a>
        </div>
        <a class="bootom_text" href="v3_ndfl_lsjl.html">我的福利详情 <i class="iconfont icon-right"></i></a>
      </div>

      <div class="index_v2_title" style="">
        <span><i class="iconfont icon-fuli"></i> 福利领取</span>
      </div>

      <div class="index_v2_nav">
        <a v-for="(item,index) in fl_list_data" :key="item.link_catid" :href="'?d_id='+item.id+'&level='+item.id">
          <img :src="item.thumb" alt="">
          <p>{{item.name}}</p>
        </a>
      </div>

      <div class="index_v2_title" style="">
        <span><i class="iconfont icon-qian4"></i> 教育补贴</span>
      </div>


      <div class="index_v3_list">
        <img src="../assets/ico_v3_70.png" alt="" class="img_src">
        <div class="tab_list">
          <a href="/APP2/v2_fxbt.html?level=1" :class="bt_hd_list['1'] == true ? 'cur':''">
            <img src="../assets/ico_v3_02.jpg" alt="">
          </a>
          <a href="/APP2/v2_fxbt.html?level=2" :class="bt_hd_list['2'] == true ? 'cur':''">
            <img src="../assets/ico_v3_03.jpg" alt="">
          </a>
          <a href="/APP2/v2_fxbt.html?level=3" :class="bt_hd_list['3'] == true ? 'cur':''">
            <img src="../assets/ico_v3_04.jpg" alt="">
          </a>
          <a href="/APP2/v2_fxbt.html?level=4" :class="bt_hd_list['4'] == true ? 'cur':''">
            <img src="../assets/ico_v3_05.jpg" alt="">
          </a>
        </div>
      </div>
      <div class="index_v2_btn">
        <div class="footer_button">
          <div class="button_item">
            <a href="v2_jybt_gd.html?d_index=2&amp;title_name=了解政策&amp;level=1">了解政策</a>
          </div>
          <div class="button_item">
            <a href="v2_sqlc.html">申领指引</a>
          </div>
          <div class="button_item">
            <a id="bt_wd_href" href="v2_wdbt.html?level=1">申领进度</a>
          </div>
          <div class="button_item">
            <a href="v2_jyjd.html">教育基地</a>
          </div>
        </div>
      </div>

      <div class="index_v2_title" style="">
        <span><i class="iconfont icon-peixun"></i> 工会培训</span>
      </div>
      <div class="index_v3_list">
        <img src="../assets/ico_v3_71.png" alt="" class="img_src">
        <div class="tab_list" id="px_href">
          <a href="/APP2/v2_fxpx.html?level=1" :class="px_hd_list['1'] !== 0 ? 'cur':''">
            <img src="../assets/ico_v3_07.jpg" alt="">
          </a>
          <a href="/APP2/v2_fxpx.html?level=2" :class="px_hd_list['2'] !== 0 ? 'cur':''">
            <img src="../assets/ico_v3_08.jpg" alt="">
          </a>
          <a href="/APP2/v2_fxpx.html?level=3" :class="px_hd_list['3'] !== 0 ? 'cur':''">
            <img src="../assets/ico_v3_09.jpg" alt="">
          </a>
          <a href="/APP2/v2_fxpx.html?level=4" :class="px_hd_list['4'] !== 0 ? 'cur':''">
            <img src="../assets/ico_v3_10.jpg" alt="">
          </a>
        </div>
      </div>
      <div class="index_v2_btn">
        <div class="footer_button">
          <div class="button_item">
            <a href="v2_xxzy.html">学习指引</a>
          </div>
          <div class="button_item">
            <a href="v2_jybt_gd.html?d_index=0&amp;title_name=培训通知&amp;level=1">培训通知</a>
          </div>
          <div class="button_item">
            <a href="/APP2/v3_cjcx.html">成绩查询</a>
          </div>
          <div class="button_item">
            <a href="/APP2/v3_jyzs.html">结业证书</a>
          </div>
        </div>
      </div>

      <div class="notice_mdl">
        <img class="img_tit" src="../assets/zgtt_img.png" alt="">
        <van-swipe class="notice_swiper" :autoplay="3000" :height="25" vertical :show-indicators="false">
          <van-swipe-item v-for="(item,index) in zgtt_data" :key="item.title+index">
            <a href="javascript:;"> <i
              :class="item.flag == 8 ?'iconfont icon-sey-hot-b ' : 'iconfont icon-iconfontnew '"></i><span>{{item.title}}</span></a>
          </van-swipe-item>
        </van-swipe>
        <a href="/APP2/v2_zgtt_list.html">
          <div class="more_text">更多</div>
        </a>
      </div>
      <div class="index_v2_title" style="border: 0">
        <span><i class="iconfont icon-yuangongguanli"></i> 职工分享</span>
      </div>
      <div class="index_v2_zgfx">
        <van-swipe :autoplay="3000"  :show-indicators="false">
          <van-swipe-item>
            <img src="http://u.tt.oucnet.com/data/upload/2018/0112/14/5a58569379e31ca68b09_384_384.jpg" class="img">
            <p>趣过春节:晒春节家乡习俗、家乡美图、家乡美食</p>
          </van-swipe-item>
          <van-swipe-item>
            <img src="http://u.tt.oucnet.com/data/upload/2018/0112/14/5a58569379e31ca68b09_384_384.jpg" class="img">
            <p>趣过春节:晒春节家乡习俗、家乡美图、家乡美食</p>
          </van-swipe-item>
          <van-swipe-item>
            <img src="http://u.tt.oucnet.com/data/upload/2018/0112/14/5a58569379e31ca68b09_384_384.jpg" class="img">
            <p>趣过春节:晒春节家乡习俗、家乡美图、家乡美食</p>
          </van-swipe-item>
        </van-swipe>
      </div>


      <div class="activity_mdl">

        <img class="sq_img_btn" src="../assets/index_v2_10.png" alt="" style="position: absolute;">

        <ul class="discuss_list" id="discuss_list">
          <li>
            <div class="top">
              <img src="static/temp/teacher1-1.png" alt="">
              <div class="top_info">
                <h4>令狐冲</h4>
                <p>国家开放大学2017届毕业生</p>
              </div>
            </div>
            <div class="discuss_txt">我们毕业了，毕业啦！我们毕业了，毕业啦！我们毕业了，毕业啦！</div>
            <div class="img_list clearfix">
              <img src="static/temp/teacher1-1.png" alt="">
              <img src="static/temp/teacher1-1.png" alt="">
              <img src="static/temp/teacher1-1.png" alt="">
              <img src="static/temp/teacher1-1.png" alt="">
            </div>
            <div class="statistical">
              <span class="date">2018-03-09 17:06:01</span>
              <em><i class="i-talk"></i> <span>0</span></em>
              <em><i class="i-prise"></i> <span>88</span></em>
            </div>
          </li>
          <li>
            <div class="top">
              <img src="static/temp/teacher1-1.png" alt="">
              <div class="top_info">
                <h4>令狐冲</h4>
                <p>国家开放大学2017届毕业生</p>
              </div>
            </div>
            <div class="discuss_txt">我们毕业了，毕业啦！我们毕业了，毕业啦！我们毕业了，毕业啦！</div>
            <div class="img_list clearfix">
              <img src="static/temp/teacher1-1.png" alt="">
              <img src="static/temp/teacher1-1.png" alt="">
            </div>
            <div class="statistical">
              <span class="date">2018-03-09 17:06:01</span>
              <em><i class="i-talk"></i> <span>0</span></em>
              <em><i class="i-prise"></i> <span>88</span></em>
            </div>
          </li>
          <li>
            <div class="top">
              <img src="static/temp/teacher1-1.png" alt="">
              <div class="top_info">
                <h4>令狐冲</h4>
                <p>国家开放大学2017届毕业生</p>
              </div>
            </div>
            <div class="discuss_txt">我们毕业了，毕业啦！我们毕业了，毕业啦！我们毕业了，毕业啦！</div>
            <div class="img_list clearfix">
            </div>
            <div class="statistical">
              <span class="date">2018-03-09 17:06:01</span>
              <em><i class="i-talk"></i> <span>0</span></em>
              <em><i class="i-prise"></i> <span>88</span></em>
            </div>
          </li>
        </ul>
      </div>
    </van-pull-refresh>
  </div>
</template>

<script>
  export default {
    name: 'Index',
    data() {
      return {
        isLoading: false,//下拉刷新
        user_Data: {
          app_down: "",
          authCode: "",
          avatar: "",
          bankbranch: "",
          bankcard: "",
          bankcard_img: "",
          bankname: "",
          card: "",
          company: "",
          company_address: "",
          company_department_id: "0",
          company_id: "",
          company_region: "",
          complete_status: 1,
          current_uid: "",
          department_name: "",
          email: "",
          idcard_img: "",
          last_login: "",
          member_type: "0",
          member_type_desc: "",
          mobile: "",
          name: "",
          netin_status: "1",
          netin_time: "",
          nickname: "",
          opera_status: "0",
          phone: "",
          pnames: "",
          regfrom: "",
          region_id: "",
          regtime: "",
          sex: "",
          site_domain: "",
          site_name: "",
          site_parents: [],
          siteid: 21,
          ucenter_mobile: "",
          ucid: "",
          uids: "",
          union_id: "",
          union_member: 0,
          union_name: "",
          union_pids: "",
        },
        fl_list_data: [{ //福利列表数据
          dirname: "",
          id: "6",
          link_catid: "1",
          name: "文化体育",
          thumb: "http://ec.ttt.workeredu.com/images/201811/category_img/2_G_1543201624243.png"
        }, { //福利列表数据
          dirname: "",
          id: "6",
          link_catid: "2",
          name: "文化体育",
          thumb: "http://ec.ttt.workeredu.com/images/201811/category_img/2_G_1543201624243.png"
        }, { //福利列表数据
          dirname: "",
          id: "6",
          link_catid: "3",
          name: "文化体育",
          thumb: "http://ec.ttt.workeredu.com/images/201811/category_img/2_G_1543201624243.png"
        }, { //福利列表数据
          dirname: "",
          id: "6",
          link_catid: "4",
          name: "文化体育",
          thumb: "http://ec.ttt.workeredu.com/images/201811/category_img/2_G_1543201624243.png"
        }],
        fl_zl_data: { //福利统计
          gtTotalPrice: '--',
          gtTotalProject: '----',
          wtTotalPrice: '--',
          wtTotalProject: '----'
        },
        bt_hd_list: {1: false, 2: false, 3: false, 4: false}, //补贴红点
        px_hd_list: {1: 0, 2: 0, 3: 0, 4: 0},
        zgtt_data: [
          {
            comments: "0",
            description: "",
            favorites: "0",
            flag: "8",
            hits: "1",
            id: "13576",
            is_recommend: "0",
            keywords: "",
            site_name: "",
            siteid: "",
            thumb: "",
            title: "",
            updatetime: "",
          }
        ]
      }
    },
    methods: {
      fl_zl_fn() {
        /*======================================================
        *@author wf_Huang
        *@Time 2018/12/18 14:48
        *=======================================================
        *@function  福利总览
        *=====================================================*/
        this.$http({
          method: 'post',
          url: this._const.apiSrc + 'index.php?s=apiv&c=studycard&m=getIndexStats',
          data: {
            'isApp': '1',
            'ucid': this._const.user_Data.ucid,
            'authCode': this._const.user_Data.authCode
          },
        }).then(function (res) {
          var json = res.data;

          if (json.status) {
            this.fl_zl_data = json.data;
          } else {
            this.$notify(json.msg);
          }

        }.bind(this)).catch(function (err) {

          this.$notify('获取数据失败，福利总览接口报错：' + err);

        }.bind(this))
      },
      fl_list_fn() {
        /*======================================================
        *@author wf_Huang
        *@Time 2018/12/18 14:48
        *=======================================================
        *@function  获取福利列表
        *=====================================================*/
        this.$http({
          method: 'post',
          url: this._const.apiSrc + 'index.php?s=apiv&c=welfare&m=getCategory',
          data: {
            'isApp': 1,
            'siteid': this._const.user_Data.siteid,
            'authCode': this._const.user_Data.authCode
          },
        }).then(function (res) {
          var json = res.data;
          if (json.status) {
            this.fl_list_data = json.data;
          } else {
            this.$notify(json.msg);
          }

        }.bind(this)).catch(function (err) {

          this.$notify('获取福利列表失败,错误：' + err);

        }.bind(this))
      },
      bt_hd_list_fn() {
        /*======================================================
        *@author wf_Huang
        *@Time 2018/12/18 14:48
        *=======================================================
        *@function 补贴红点
        *=====================================================*/
        this.$http({
          method: 'post',
          url: this._const.apiSrc + 'index.php?s=apiv&c=subsidy&m=noapply',
          data: {
            'isApp': 1,
            'ucid': this._const.user_Data.ucid,
            'region_id': this._const.user_Data.region_id,
            'union_id': this._const.user_Data.union_id,
            'authCode': this._const.user_Data.authCode,
          },
        }).then(function (res) {
          var json = res.data;
          if (json.status) {
            this.bt_hd_list = json.data;
          } else {
            this.$notify(json.msg);
          }

        }.bind(this)).catch(function (err) {

          this.$notify('补贴红点错误：' + err);

        }.bind(this))
      },
      px_hd_list_fn() {
        /*======================================================
        *@author wf_Huang
        *@Time 2018/12/18 14:48
        *=======================================================
        *@function 培训红点
        *=====================================================*/
        this.$http({
          method: 'post',
          url: this._const.apiSrc + 'index.php?s=apiv&c=studycard&m=getEduStatus',
          data: {
            'isApp': 1,
            'ucid': this._const.user_Data.ucid,
            'authCode': this._const.user_Data.authCode
          },
        }).then(function (res) {
          var json = res.data;
          if (json.status) {
            this.px_hd_list = json.data;
          } else {
            this.$notify(json.msg);
          }

        }.bind(this)).catch(function (err) {

          this.$notify('补贴红点错误：' + err);

        }.bind(this))
      },
      zgtt_list_fn() {
        /*======================================================
        *@author wf_Huang
        *@Time 2018/12/18 14:48
        *=======================================================
        *@function 职工头条
        *=====================================================*/
        this.$http({
          method: 'post',
          url: this._const.apiSrc + 'index.php?s=apiv&c=news&m=v2_get_news',
          data: {
            'isApp': 1,
            'region_id': this._const.user_Data.region_id,
            'union_id': this._const.user_Data.union_id,
            'authCode': this._const.user_Data.authCode,
            'limit': 10,
            'page': 1,
            'flag_ids': '8,9'
          },
        }).then(function (res) {
          var json = res.data;
          if (json.status) {
            this.zgtt_data = json.data;
          } else {
            this.$notify(json.msg);
          }

        }.bind(this)).catch(function (err) {

          this.$notify('职工头条错误：' + err);

        }.bind(this))
      },
      onRefresh() {
        /*======================================================
        *@author wf_Huang
        *@Time 2018/12/18 15:51
        *=======================================================
        *@function  下拉刷新
        *=====================================================*/
        this.fl_zl_fn();
        this.fl_list_fn();
        this.bt_hd_list_fn();
        this.px_hd_list_fn();
        this.zgtt_list_fn();

        setTimeout(() => {
          this.isLoading = false;
        }, 500);
      }
    },
    mounted() {
      this._const.user_Data = JSON.parse(window.localStorage.getItem('user_Data'));
      this.user_Data = this._const.user_Data;

      this.fl_zl_fn();
      this.fl_list_fn();
      this.bt_hd_list_fn();
      this.px_hd_list_fn();
      this.zgtt_list_fn();

      this.$toast.clear();
    }
  }
</script>


<style lang="scss" scoped>


  .index_body {

    .top_text_body {
      background-color: #fff;
      padding: 30px;
      position: fixed;
      top: 0;
      left: 0;
      height: 80px;
      z-index: 1;
      right: 0;
      h1 {
        font-size: 40px;
        margin: 0;
        span {
          font-size: 24px;
          color: #999999;
          font-weight: normal;
        }
      }

      .qh_btn {
        position: absolute;
        right: 30px;
        top: 30px;
        font-size: 26px;
      }
      p {
        margin: 0;
        color: #999999;
      }

    }
    .user_mdl {
      position: relative;
      height: 448px;
      margin-top: 140px;
      background: url(../assets/ico_v3_85.png) no-repeat center bottom;
      background-size: 100% auto;
    }
    .user_main {
      padding: 40px 30px;
      position: relative;
      .img {
        float: left;
        width: 90px;
        height: 90px;
        margin-right: 30px;
        img {
          width: 100%;
          height: 100%;
          border-radius: 100%;
        }
      }
      .info {
        overflow: hidden;
        h3 {
          font-size: 36px;
          color: #fff;
          font-weight: bold;
          margin-bottom: 10px;
          margin-top: 0;
          span {
            font-size: 0.24rem;
            margin-left: 0.1rem;
            color: rgba(255, 255, 255, 0.8);;
          }
        }
        p {
          color: #f3b7b5;
          font-size: 28px;
          margin-bottom: 15px;
          margin-top: 0;
        }
        .gh_label {
          display: inline-block;
          height: 38px;
          line-height: 38px;
          border-radius: 21px;
          background: #ff6853;
          border: 2px solid #f99451;
          color: #fff;
          padding: 0 20px;
          font-size: 20px;
        }
      }
      .rz_btn {
        display: inline-block;
        height: 40px;
        line-height: 45px;
        padding: 0 15px 0 10px;
        border-radius: 20px;
        background: #fff;
        color: #fb472e;
        font-size: 24px;
        position: absolute;
        top: 40px;
        right: 30px;
        i {
          display: inline-block;
          margin-right: 5px;
          vertical-align: top;
          position: relative;
          top: 5px;
          line-height: 30px;
          color: #FF822F;
        }
      }
    }

    .flzj_tab {
      margin: -250px 30px 0;
      height: 517px;
      background: url(../assets/ico_v3_84.png) no-repeat center bottom;
      background-size: 100% auto;
      position: relative;
      .top_nx_text {
        position: absolute;
        color: #666666;
        font-size: 30px;
        text-align: center;
        left: 30px;
        right: 30px;
        top: 35px;
      }
      .je_text {
        position: absolute;
        top: 150px;
        left: 30px;
        right: 30px;
        display: flex;
        text-align: center;
        .je_item {
          flex: 1;
          font-size: 60px;
          font-weight: bold;
          color: #fb472e;
        }
      }
      .xm_text {
        position: absolute;
        top: 300px;
        left: 30px;
        right: 30px;
        display: flex;
        text-align: center;
        .je_item {
          flex: 1;
          p {
            color: #ffffff;
            font-size: 24px;
            line-height: 40px;
            margin: 0;
          }
          strong {
            font-size: 60px;
            font-weight: bold;
            color: #ffffff;
          }
        }
      }
      .bootom_text {
        position: absolute;
        bottom: 25px;
        left: 100px;
        line-height: 80px;
        right: 100px;
        color: #8c1f32;
        font-size: 28px;
        font-weight: bold;
        text-align: center;
        i {
          font-size: 25px;
        }
      }
    }

    .index_v2_nav {
      display: flex;
      padding: 20px 0;
      min-height: 120px;
      flex-wrap: wrap;
      a {
        text-decoration: none;
        width: 25%;
        text-align: center;
        font-size: 24px;
        margin-bottom: 20px;
        font-family: "Microsoft YaHei";
        img {
          width: 100px;
          height: 100px;
          margin-bottom: 5px;
        }
        p {
          font-size: 24px;
          margin: 0;
          color: #333;
        }
      }
    }
  }

  .index_v3_list {
    padding: 0 30px 30px;
    .img_src {
      height: 129px;
      width: 100%
    }

    .tab_list {
      display: flex;
      flex-wrap: wrap;
      margin: 20px 0;
      a {
        width: 340px;
        height: 108px;
        border-radius: 1px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
        &:nth-child(1) {
          margin-right: 5px;
          margin-bottom: 5px;
        }
        &:nth-child(2) {
          margin-left: 5px;
          margin-bottom: 5px;
        }
        &:nth-child(3) {
          margin-right: 5px;
          margin-top: 5px;
        }
        &:nth-child(4) {
          margin-left: 5px;
          margin-top: 5px;
        }
        img {
          width: 100%;
          height: 100%;
        }
      }
      .cur {
        position: relative;
        &::after {
          position: absolute;
          color: #f70404;
          content: '●';
          font-size: 28px;
          top: 10px;
          right: 25px;
          height: 17px;
        }
      }

    }
  }

  .index_v2_btn {
    padding-bottom: 0.3rem;
    .footer_button {
      display: flex;
      .button_item {
        flex: 1;
        text-align: center;
        a {
          width: 1.4rem;
          height: 0.45rem;
          line-height: 0.45rem;
          font-size: 0.24rem;
          color: #333333;
          background-color: #F6F7F9;
          border-radius: 0.5rem;
          padding: 0.05rem 0.2rem;
        }
      }
    }
  }

  .h_text_sl_1 {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }

  .index_v2_title {
    border-top: 20px solid #F8F8F8;
    font-size: 24px;
    color: #999999;
    text-align: center;
    padding: 15px 0;
    position: relative;
    height: 50px;
    line-height: 50px;
    &:after {
      content: '';
      border-bottom: 2px solid #E9E9E9;
      position: absolute;
      bottom: 50%;
      right: 30px;
      left: 30px;
      z-index: 1;
    }
    span {
      background-color: #ffffff;
      display: inline-block;
      position: absolute;
      margin-left: -80px;
      padding: 0 15px;
      z-index: 2;
      i {
        font-size: 24px;
      }
    }

  }

  .notice_mdl {
    border: 0;
    background-color: #F8F8F8;
    margin: 0;
    padding: 30px;
    position: relative;
    .img_tit {
      float: left;
      width: 90px;
      margin-right: 20px;
    }
    .notice_swiper {
      margin: 0 100px 0 0;
      position: relative;
      overflow: hidden;
      height: 90px;
      z-index: 1;
      a {
        display: block;
        overflow: hidden;
        color: #333;
        line-height: 45px;
        font-size: 22px;
        span {
          display: block;
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden;
          line-height: 45px;
          margin-left: 50px;
        }
        i.icon-iconfontnew {
          font-size: 45px;
          color: #feb363;
          line-height: 45px;
          vertical-align: middle;
          margin-right: 10px;
        }
        i.icon-sey-hot-b {
          font-size: 45px;
          color: #fb6a38;
          line-height: 45px;
          vertical-align: middle;
          margin-right: 10px;
        }

      }
    }
    .more_text {
      border-left: 1px solid #fff;
      background-color: #f8f8f8;
      position: absolute;
      right: 0;
      top: 0;
      bottom: 0;
      width: 100px;
      text-align: center;
      line-height: 150px;
      color: #999;
      z-index: 99;
      font-size: 22px
    }
  }

  .activity_mdl {
    position: relative;
    .sq_img_btn {
      width: 157px;
      height: 160px;
      position: absolute;
      top: 30px;
      right: 30px;
    }
    .discuss_list {
      li {
        border-bottom: 2px solid #d9d9d9;
        padding: 20px 0;
        .top {
          overflow: hidden;
          margin-bottom: 20px;
          img {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            float: left;
            margin-right: 10px;
          }
          .top_info {
            overflow: hidden;
            h4 {
              color: #333;
              font-size: 26px;
              margin-bottom: 10px;
            }
            p {
              color: #999;
              font-size: 24px;
            }
          }
        }
        .discuss_txt {
          line-height: 40px;
          font-size: 26px;
          color: #333;
          margin-bottom:  20px;
        }
        .img_list img {
          width: 20px;
          height: 20px;
          float: left;
          margin-bottom: 10px;
          margin-right: 10px;
        }
        .statistical {
          overflow: hidden;
          margin-top: 20px;
          .date {
            float: left;
            font-size: 24px;
            color: #999;
            line-height: 40px;
          }
          em {
            float: right;
            font-size: 24px;
            color: #999;
            line-height: 40px;
            margin-left: 30px;
            i {
              display: inline-block;
              width: 35px;
              vertical-align: middle;
              margin-right: 5px;
            }
          }
        }
      }
    }
  }

  .index_v2_zgfx
  {
    padding: 0 30px 30px;
    border-bottom: 20px solid #F8F8F8;
    overflow: hidden;
    .img {
      width: 620px;
      height: 200px;
      border-radius: 10px;
    }
    p {
      font-size: 30px;
      margin-top: 10px;
      height: 35px;
      display: block;
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
    }
  }
</style>
